<template>
	<view class="container">
		<!-- 状态栏 -->
		<view :class="statusBarViewClass"></view>
		<!-- 个人信息 -->
		<view class="page-top">
			<image class="user-img" mode="aspectFill" @error="setDefImg" @longpress="showSwitchIPView"
				:src="userInfo.img?(userInfo.img.startsWith('http')?userInfo.img:(api.host+userInfo.img)):'/static/image/head_pic.png'">
			</image>
			<view class="user-info">
				<view class="user-name">{{userInfo.nickName?userInfo.nickName:'登陆可查看更多内容'}}</view>
				<view class="user-info-item">
					<text class="user-info-item-label">等级: 100</text>
					<!-- <text class="user-info-item-text">等级: 100</text> -->
				</view>
				<view class="user-info-item">
					<text class="user-info-item-label">金币: 10000</text>
					<!-- <text class="user-info-item-text">金币: 10000</text> -->
				</view>
			</view>
			<view class="user-more">
				<uni-icons type="right" color="#666666" size="20" @click="goSetUser" v-if="getUserId()>0"></uni-icons>
				<text class="login-text" @click="goLogin" v-else>前往登陆</text>
			</view>
		</view>
		<!-- 功能列表 -->
		<view class="content-item" @click="goManageAccount">
			<view class="content-item-left">
				<uni-icons type="locked" color='#FF4F80' size="26"></uni-icons>
				<text class="text-left">账号安全</text>
			</view>
			<view class="content-item-right">
				<text class="text-right"></text>
				<uni-icons type="right" size="16"></uni-icons>
			</view>
		</view>
		<view class="content-item" @click="goFavoriteMovPage">
			<view class="content-item-left">
				<uni-icons type="star" color='#FF4F80' size="25"></uni-icons>
				<text class="text-left">我的收藏</text>
			</view>
			<view class="content-item-right">
				<text class="text-right"></text>
				<uni-icons type="right" size="16"></uni-icons>
			</view>
		</view>
		<view class="content-item" @click="goManageContent">
			<view class="content-item-left">
				<uni-icons type="wallet" color='#FF4F80' size="25"></uni-icons>
				<text class="text-left">内容管理</text>
			</view>
			<view class="content-item-right">
				<text class="text-right"></text>
				<uni-icons type="right" size="16"></uni-icons>
			</view>
		</view>
		<view class="content-item" @click="openInputDialog" v-if="showSwitchIP">
			<view class="content-item-left">
				<uni-icons type="cloud-download" color='#FF4F80' size="26"></uni-icons>
				<text class="text-left">切换服务IP</text>
			</view>
			<view class="content-item-right">
				<text class="text-right"></text>
				<uni-icons type="right" size="16"></uni-icons>
			</view>
		</view>
		<view class="content-item" @click="openAlertDialog(2)" v-if="showSwitchIP">
			<view class="content-item-left">
				<uni-icons type="cloud-download" color='#FF4F80' size="26"></uni-icons>
				<text class="text-left">重置服务IP</text>
			</view>
			<view class="content-item-right">
				<text class="text-right"></text>
				<uni-icons type="right" size="16"></uni-icons>
			</view>
		</view>
		<view class="content-item" @click="goVersionPage">
			<view class="content-item-left">
				<uni-icons type="info" color='#FF4F80' size="26"></uni-icons>
				<text class="text-left">检查版本</text>
			</view>
			<view class="content-item-right">
				<text class="text-right"></text>
				<uni-icons type="right" size="16"></uni-icons>
			</view>
		</view>
		<view class="content-item" @click="goAbout">
			<view class="content-item-left">
				<uni-icons type="person" color='#FF4F80' size="26"></uni-icons>
				<text class="text-left">关于</text>
			</view>
			<view class="content-item-right">
				<text class="text-right"></text>
				<uni-icons type="right" size="16"></uni-icons>
			</view>
		</view>
		<view class="content-item" @click="closePc" v-if="showClosePcBt">
			<view class="content-item-left">
				<uni-icons type="clear" color='#FF4F80' size="26"></uni-icons>
				<text class="text-left">关机</text>
			</view>
			<view class="content-item-right">
				<text class="text-right"></text>
				<uni-icons type="right" size="16"></uni-icons>
			</view>
		</view>

		<!-- IP输入框 -->
		<uni-popup ref="inputDialog" type="dialog">
			<uni-popup-dialog mode="input" title="输入IP地址" placeholder="空值，会 恢复为系统默认IP" v-model="ip_value"
				@confirm="dialogInputConfirm"></uni-popup-dialog>
		</uni-popup>

		<!-- 通用提示窗 -->
		<uni-popup ref="alertDialog" type="dialog">
			<uni-popup-dialog type="info" cancelText="取消" :confirmText="alertConfirmText" :title="alertTitle"
				:content="alertContent" @confirm="alertConfirmEv"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue'
	import {
		onLoad,
	} from '@dcloudio/uni-app'
	import {
		showToast,
		getUserInfo,
		getUserId,
		clearUserInfo,
		is18YearsOld,
		getUserToken
	} from '@/utils/utils.js'
	import api from '@/config/api'
	import request from '@/utils/request'

	const statusBarViewClass = ref("status-bar-view-2")
	const userInfo = ref(getUserInfo())

	const showSwitchIP = ref(false)

	const showClosePcBt = ref(false)

	const inputDialog = ref(null)
	const ip_value = ref(null)

	const alertDialog = ref(null)
	const alertTitle = ref("")
	const alertContent = ref("")
	const alertConfirmText = ref("")
	const alertDialogType = ref(0)

	onLoad(() => {
		if (api.host.includes('192.168')) {
			showClosePcBt.value = true
		}
	})

	// 默认图片
	const setDefImg = () => {
		userInfo.value.img = "/static/image/head_pic.png"
	}

	// 显示出来隐藏的切换IP
	const showSwitchIPView = () => {
		showSwitchIP.value = !showSwitchIP.value
	}

	// 打开ip输入框
	const openInputDialog = () => {
		ip_value.value = api.host
		inputDialog.value.open()
	}

	// 确认切换IP
	const dialogInputConfirm = (val) => {
		if (val == api.host) {
			return
		}

		if (!val || val.trim() == '') {
			// 空值，根据环境，还原初始IP
			if (process.env.NODE_ENV == 'development') {
				api.setDevHost()
			} else {
				api.setSysHost()
			}
		} else {
			// 非空，使用输入IP
			val = val.trim()
			if (!val.startsWith('http')) {
				val = 'http://' + val
			}
			val = val.replace('：', ':')
			val = removeTrailingSlashes(val)
			if (val) {
				api.updateHost(val)
			}
		}

		clearUserInfo()
		uni.reLaunch({
			url: '/pages/index/index'
		})
	}

	// 格式化IP
	const removeTrailingSlashes = (str) => {
		return str.replace(/[\\/]+$/, '');
	}

	// 打开Confirm提示框
	const openAlertDialog = (type) => {
		if (type == 2) {
			alertDialogType.value = 2
			alertContent.value = "确认重置为系统初始服务IP吗？"
			alertTitle.value = "重置服务IP"
			alertConfirmText.value = '确认重置'
			alertDialog.value.open()
		}
	}

	// Confirm提示框确认事件
	const alertConfirmEv = () => {
		if (alertDialogType.value == 2) {
			dialogInputConfirm('')
		}
	}

	// 前往我的收藏或者登陆
	const goFavoriteMovPage = () => {
		if (getUserId() > 0) {
			uni.navigateTo({
				url: '/pages/favorite/favorite'
			})
		} else {
			uni.navigateTo({
				url: '/pages/login/login'
			})
		}

	}

	// 前往登陆
	const goLogin = () => {
		uni.navigateTo({
			url: '/pages/login/login'
		})
	}

	// 前往设置账号信息
	const goSetUser = () => {
		uni.navigateTo({
			url: '/pages/user/user'
		})
	}

	// 前往账号安全
	const goManageAccount = () => {
		if (getUserId() > 0) {
			uni.navigateTo({
				url: '/pages/manage_account/manage_account'
			})
		} else {
			uni.navigateTo({
				url: '/pages/login/login'
			})
		}

	}

	// 内容管理
	const goManageContent = () => {
		if (getUserId() > 0) {
			uni.navigateTo({
				url: '/pages/manage_content/manage_constent'
			})
		} else {
			uni.navigateTo({
				url: '/pages/login/login'
			})
		}
	}

	// 前往检查更新
	const goVersionPage = () => {
		uni.navigateTo({
			url: '/pages/version/version'
		})
	}

	// 前往关于页面
	const goAbout = () => {
		uni.navigateTo({
			url: '/pages/about/about'
		})
	}

	// 本地IP时，远程关机
	const closePc = () => {
		request.get(api.host + api.closePcUrl).then((res) => {
			showToast(res.msg)
		})
	}
</script>

<style lang="scss">
	@import url("me.css");
</style>